<template>
  <div>
    <the-table :columns="columns" uri="s/pass-sells" ref="table">
      <span slot="action" slot-scope="{ row }">
        <a class="ant-dropdown-link" @click="buy(row)"
          ><a-icon type="edit" /> 购买
        </a>
      </span>
    </the-table>
    <this-modal ref="modal" @refresh="refresh" />
  </div>
</template>
<script>
import theTable from '@/components/theTable.vue'
import thisModal from './modal.vue'

const columns = [
  {
    title: '订单号',
    dataIndex: 'id',
    searchAble: true,
  },

  {
    title: '币值',
    dataIndex: 'coins',
  },

  {
    title: '银行',
    dataIndex: 'bank',
    width: 120,
  },
  {
    title: '银行卡',
    dataIndex: 'bankcard',
  },
  {
    title: '开户人',
    dataIndex: 'realname',
    width: 80,
  },
  {
    title: '提交时间',
    dataIndex: 'created_at',
  },
  // {
  //   title: '接单时间',
  //   dataIndex: 'took_at',
  // },
  // {
  //   title: '完成时间',
  //   dataIndex: 'done_at',
  // },
  // {
  //   title: '状态',
  //   dataIndex: 'state',
  //   width: 80,
  //   customRender: (val) => {
  //     const map = new Map([
  //       ['pass', '售出中'],
  //       // ['took', '已接单'],
  //       // ['frozen', '已担保'],
  //       // ['done', '已完成'],
  //       // ['canceled', '已取消'],
  //     ])
  //     return map.get(val)
  //   },
  // },
  {
    title: '操作',
    key: 'action',
    scopedSlots: { customRender: 'action' },
    width: 80,
  },
]

export default {
  components: { theTable, thisModal },

  data() {
    return {
      columns,
    }
  },
  computed: {},
  mounted() {},
  methods: {
    buy(row) {
      this.axios.get(`/s/buys/${row.id}/lock`).then((res) => {
        if (res.data.code === 1) {
          this.$refs.modal.open(row)
        } else {
          this.$message.error(res.data.msg)
        }
      })
    },
    refresh() {
      this.$refs.table.fetch()
    },
  },
}
</script>
